import { renderIcon } from '@/store/useNaive'
import { MenuOption } from 'naive-ui'
import { RouteRecordRaw, useRouter } from 'vue-router'

const routeTree2MenuTree = (routeTree: RouteRecordRaw[]): MenuOption[] => {
	const menuTree: MenuOption[] = []
	routeTree.forEach(route => {
		const icon = route.meta?.icon ? renderIcon(route.meta.icon) : undefined
		let children: MenuOption[] | undefined
		if (route.children) children = routeTree2MenuTree(route.children)
		const menuNode: MenuOption = {
			key: route.path,
			label: route.name,
			icon,
			children
		}
		menuTree.push(menuNode)
	})
	return menuTree
}

export default () => {
	const router = useRouter()
	const menuOptions = computed(() => routeTree2MenuTree(router.options.routes[0].children || []))
	return {
		/** 侧边栏菜单树 */
		menuOptions
	}
}
